export default {
  data () {
    return {
      Echart: null,
      time: [],
      weightRecordStageData: {
        weightRecordData: {
          load: [],
          force: []
        }
      },
      weightRecordOption: {
        tooltip: {
          trigger: 'axis',
          confine: true,
          axisPointer: {
            type: 'none',
            label: {
              backgroundColor: '#6a7985'
            }
          }
        },
        legend: {
          top: 10,
          itemWidth: 10,
          itemHeight: 10,
          textStyle: {
            color: '#898989'
          },
          data: [{name: '吊重', icon: 'rect'}, {name: '力矩', icon: 'rect'}]
        },
        grid: {
          left: 20,
          right: 10,
          bottom:35,
          top: 35,
          containLabel: true
        },
        dataZoom: {
          show: true,
          realtime: true,
          y: 200,
          height: 10,
          xAxisIndex: [
            0
          ],
          // start: 50,
          // end: 80
          startValue:0,
          endValue:0,
          textStyle:{color:"#999"},
        },
        xAxis: [
          {
            name: '',
            type: 'category',
            boundaryGap: false,
            data: [],
            axisLabel: {
              interval:29,
              color: '#939393'
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#e8e8e8',
                width: 2
              }
            },
            axisTick: {
              show: false
            },
            splitLine: {
              show: false,
              lineStyle: {
                color: '#a8c5ed'
              }
            }
          }
        ],
        yAxis: [
          {
            type: 'value',
            name: '吊重（t）',
            nameTextStyle: {
              color: '#898989'
            },
            ax: {
              show: false,
              color: '#a8c5ed'
            },
            axisTick: {
              show: false
            },
            axisLine: {
              show: false,
              lineStyle: {
                color: '#929292',
                width: 2
              }
            },
            splitLine: {
              lineStyle: {
                type: 'dashed',
                color: '#e8e8e8'
              }
            },
            position: ''
          },
          {
            type: 'value',
            name: '力矩',
            nameTextStyle: {
              color: '#898989'
            },
            ax: {
              show: false,
              color: '#a8c5ed'
            },
            axisTick: {
              show: false
            },
            axisLine: {
              show: false,
              lineStyle: {
                color: '#929292',
                width: 2
              }
            },
            splitLine: {
              lineStyle: {
                type: 'dashed',
                color: '#e8e8e8'
              }
            },
            position: 'right'
          }
        ],
        series: []
      }
    }
  },
  mounted () {
  },
  methods: {
    initWeightRecord (a1,a2,t,start,end) {
      this.weightRecordStageData.weightRecordData.load = a1
      this.weightRecordStageData.weightRecordData.force = a2
      this.weightRecordOption.xAxis[0].data = t
      this.weightRecordOption.dataZoom.startValue = start
      this.weightRecordOption.dataZoom.endValue = end
      if (this.weightRecordEchart) {
        this.weightRecordOption.series.forEach(item => {
          item.data = []
        })
      }
      if (this.weightRecordStageData.weightRecordData) {
        for (let weightRecord in this.weightRecordStageData.weightRecordData) {
          this[weightRecord]()
        }
      }
      this.weightRecordEchart = this.$Echarts.init(this.$refs.weightRecord)
      this.weightRecordEchart.setOption(this.weightRecordOption)
    },
    load () {
      let LOADData = []
      this.weightRecordStageData.weightRecordData.load.forEach((item) => {
        LOADData.push(item.value)
      })
      let LOADSeries = 
      {
        name:'吊重',
        type:'bar',
        barGap: '100%',
        data:LOADData,
        barWidth : 3,
        yAxisIndex: 0,
        itemStyle:{
          normal:{
            color:'#33cadb'
          }
        }
      }
      this.weightRecordOption.series.push(LOADSeries)
    },
    force () {
      let ForceData = []
      this.weightRecordStageData.weightRecordData.force.forEach((item) => {
        ForceData.push(item.value)
      })
      let ForceSeries = {
        name: '力矩',
        type: 'line',
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [{
              offset: 0, color: 'rgba(183, 241, 229, 0.7)' // 0% 处的颜色
            }, {
              offset: 1, color: 'rgba(183, 241, 229, 0.1)' // 100% 处的颜色
            }],
            globalCoord: false // 缺省为 false
          }
        },
        itemStyle: {
          color: '#4bdaa4',
          opacity: 0
        },
        yAxisIndex: 1,
        data: ForceData
      }
      this.weightRecordOption.series.push(ForceSeries)
    }
  }
}
